import React, { Component } from 'react'; 


export default class Method01 extends Component {
	constructor(props){
		super(props);
		this.add02 = this.add02.bind(this);
	}
	state = {
		////数据源-3
		msg01: '事件this演示',
		total1: 1,
		total2: 11,
	}
	add01 () {
		console.log('add01', this.state);
		this.setState({
			total1: this.state.total1 + 1,
		})
		this.setState({
			total2: this.state.total2 + 1,
		})
	}
	add02 () {
		console.log('add02', this.state);
		this.setState({
			total1: this.state.total1 + 1,
		})
	}
	add03 = () => {
		console.log('add03', this.state);
	}
	add04 () {
		console.log('add04', this.state);
	}
	// 更新阶段-是否执行更新
	shouldComponentUpdate (nextProps, nextState) {
		console.log('nextProps', nextProps);
		console.log('nextState', nextState);
		return true;//true,重调render;false,不重调render
	}
	
	// 渲染函数
    render() {
    	console.log('Method01', 'render');
    	return (
			<div>
			    <hr />
			    <div onClick={this.add01.bind(this)}>{this.state.msg01}</div>
			    <div onClick={this.add02}>{this.state.msg01}</div>
			    <div onClick={this.add03}>{this.state.msg01}</div>
			    <div onClick={(event)=>{this.add04();}}>{this.state.msg01}</div>
			</div>
		);
    }
};
